<template>
    <div class="pagination">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page"
        :page-sizes="[5, 10, 15, 20]"
        :page-size="10"
        layout="total, sizes, prev, pager, next, jumper"
        :total="componentTotal"
      ></el-pagination>
    </div>
  </template>
  
  <script>
  export default {
    props: {
      page: Number,
      componentTotal: Number,
    },
    methods: {
      handleSizeChange(val) {
        this.$emit('changeRows', val)
      },
      handleCurrentChange(val) {
        this.$emit("changePage", val)
      },
    },
  };
  </script>
  
  <style lang="scss" ccoped>
  .pagination{
    margin-top: 12px;
  }
  </style>